html{
font-size: calc(100vw/10.8);
width: 100%;

overflow-x: hidden;

position: absolute;


}

*{font-size: .3rem; padding:0; margin:0;}
.main{
    position: relative;
    margin: .2rem auto;
    border: .01rem solid steelblue;
    width: 9.3rem;
    height: 9rem;
}
.msgInput{
    display: block;
    width: 9.06rem;
    height: 2.6rem;
    margin: .1rem auto;
    
}
.sendbtn{
    position: absolute;
    width: 1.5rem;
    height: .4rem;
    bottom: .05rem;
    right: .1rem;
}
.content{
    list-style: none;
    width: 9.1rem;
    height: 5.5rem;
    margin: .05rem auto;
    border: .01rem dotted #D1D3D6;
    overflow-y: scroll;
}
.msgContent{
    width:auto;
    max-width: 2.5rem;
    height: auto;
    word-break: break-all;
    margin: .05rem;
    padding: .03rem;
    border-radius: .05rem;
}

.content .left{
    float: left;
    text-align: left;
    background-color: lightgrey;
}
.content .right{
    float: right;
    text-align: right;
    background-color: yellowgreen;
}



















